<script setup lang="ts">
import myTitle from "@/components/myTitle/myTitle.vue";
import listItem from "@/components/zhq-listItem/index.vue";
import huaList from "@/components/zhq-listItem/huaList.vue";
const title = ref("关注");
const tab = ref<number>(0);
const navData = ["医生", "话题"];
const Listdata = ref([
  {
    id: 1,
    title: "两性健康",
    desc: "300人关注 700篇文章",
    src: "/src/static/header-img/9.png",
  },
  {
    id: 2,
    title: "两性健康",
    desc: "300人关注 700篇文章",
    src: "/src/static/header-img/9.png",
  },
  {
    id: 3,
    title: "两性健康",
    desc: "300人关注 700篇文章",
    src: "/src/static/header-img/9.png",
  },
]);
</script>

<template>
  <div class="" style="height: 100vh; background-color: #ffffff">
    <view>
      <myTitle :title="title" :ifText="true" />
    </view>
    <view>
      <wd-tabs v-model="tab" swipeable>
        <block v-for="(item, index) in navData" :key="item">
          <wd-tab :title="item" style="border-bottom: 1rpx solid #eeedf5">
            <scroll-view scroll-y>
              <listItem v-if="index == 0" />
              <huaList v-else :ListData="Listdata" />
            </scroll-view>
          </wd-tab>
        </block>
      </wd-tabs>
    </view>
  </div>
</template>

<style lang="scss" scoped>
:deep() {
  .wd-tabs__line[data-v-c72f40b5] {
    top: 80rpx;
    background-color: #29c6aa;
  }
}
</style>
